<template>
  <div class="contents">
    <el-row type="flex">
      <el-col :span="8" style="padding-right: 15px;">
        <div class="titles">分割方案</div>
        <div style="height: 255px; overflow: hidden auto;">
          <p class="text-center">暂无方案</p>
        </div>
      </el-col>
      <el-col :span="16">
        <div class="titles">分割方案明细</div>
        <div class="list-detail" style="height: 255px; overflow: hidden auto;">
          <div class="titles">分割原料</div>
          <el-row type="flex" align="middle">
            <el-col>原料名称:</el-col>
            <el-col>当前库存:</el-col>
            <el-col>
              <span>消耗量:</span>
              <el-input style="dispaly: inline-block; width: 120px;"></el-input>
            </el-col>
          </el-row>
          <div class="titles">分割获得成品</div>
          <el-table :data="table1" style="width: 100%; margin-bottom: 10px;">
            <el-table-column prop="address" label="商品"></el-table-column>
            <el-table-column prop="address" label="单位"></el-table-column>
            <el-table-column prop="address" label="参考系数"></el-table-column>
            <el-table-column
              prop="address"
              label="参考获得量/斤"
            ></el-table-column>
            <el-table-column
              prop="address"
              label="实际获得量/斤"
            ></el-table-column>
          </el-table>
          <el-button type="primary">确认分割</el-button>
        </div>
      </el-col>
    </el-row>
    <div style="position: fixed; top: 15px; right: 350px; z-index: 9999;">
      <el-button type="primary" @click="goAdd">新增方案</el-button>
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        table1: [],
      }
    },
    methods:{
        goAdd(){
            this.$router.push('/roomstore/division/addPlan')
        }
    }
  }
</script>

<style lang="scss" scoped>
  .contents {
    padding: 10px 20px;

    .titles {
      font-size: 14px;
      font-weight: bolder;
      margin-bottom: 10px;
    }

    .text-center {
      text-align: center;
    }

    .list-detail {
      padding: 10px;
      border: 1px solid #dedede;
    }
  }
</style>
